<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div id="model">
        {{age}}
        <br>
        {{name}}
        <br>
        {{red}}
    </div>

    <script src="https://cdn.jsdelivr.net/npm/vue@2.6.12"></script>

    <script>
        let data = {
            age: "黑曼巴",
            name: "黑7黑8",
            red: "结果是横扫"
        }
        data.nickname = 'dhg';

        let model = new Vue({
            el: "#model",
            data: () => {
                return data
            }, mounted: function () {
                console.log('湖人');
            }, created: function () {
                console.log('太阳');
            }, beforeUpdate: function () {
                console.log('数据更新前');
                console.log(this);
            }, updated: function () {
                console.log('数据更新后');
                console.log(this);
            }

            // template:'<a>风骨</a>'
        })

        console.log(model.$el);
        console.log(data);

        console.log(model.age === data.age);
    </script>

</body>

</html>